<!DOCTYPE html>
<html lang="en">

<head>
    <title>Multiplication Table Tester</title>
    <link rel="stylesheet" href="styles.css">
    <script src="multiplicationtables.js"></script>
</head>

<body>
    <p class="menuHeading">Multiplication Table Tester</p>
    <!-- Times table list will be built by code-->

    <ul id="multiplicationTablesItems" class="menuMultiplicationTableList">

    </ul>

    <p>
        <label class="menuLabel" for="multiplicationTableNoInput">Which multiplication table do you want :</label>
        <input class="menuInput" type="number" id="multiplicationTableNoInput" value="2" min="2" max="20"> 
    </p>

    <p>
        <label class="menuLabel" for="multiplicationTableCountInput">How many lines do you want :</label>
        <input class="menuInput" type="number" id="multiplicationTableCountInput" value="12" min="12" max="20"> 
    </p>

    <button class="menuButton" onclick="makeMultiplicationTables('multiplicationTablesItems', 'multiplicationTableNoInput','multiplicationTableCountInput')">Make the multiplication table</button>
    <button class="menuButton" onclick="checkMultiplicationTables('multiplicationTablesItems')">Check the multiplication table</button>
</body>

</html>